<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>W+云水务</title>
	<link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
	<link rel="stylesheet" type="text/css" href="../../themes/icon.css">
	<link rel="stylesheet" type="text/css" href="../demo.css">
	<link rel="stylesheet" type="text/css" href="../../libs/ribbon/ribbon.css">
	<link rel="stylesheet" type="text/css" href="../../libs/ribbon/ribbon-icon.css">
	<script type="text/javascript" src="../../jquery.min.js"></script>
	<script type="text/javascript" src="../../jquery.easyui.min.js"></script>
	<style type="text/css">
		body {
			margin:0; padding:0;
		}
		.ribbon-group {
			height:60px;
		}
		.ribbon-group-sep {
			height:100%; 
		}
		.ribbon-group .l-btn-selected, .ribbon-group .l-btn-selected:hover {
			background-color:#eaf2ff; border:1px solid #b7d2ff; padding:0;
		}
	</style>
</head>

<body class="easyui-layout">
	<div data-options="region:'north',border:false" style="height:100px;">
		<div class="easyui-tabs" data-options="tabWidth:112,border:false">
			<div title="首页">
				<div class="ribbon-group">
					<a href="javascript:void(0)" class="l-btn l-btn-large l-btn-plain l-btn-selected" group="" id=""><span class="l-btn-left l-btn-icon-top"><span class="l-btn-text">系统监控</span><span class="l-btn-icon icon-picture-large">&nbsp;</span></span></a>
					<a href="javascript:void(0)" class="l-btn l-btn-large l-btn-plain" group="" id=""><span class="l-btn-left l-btn-icon-top"><span class="l-btn-text">报表分析</span><span class="l-btn-icon icon-clipart-large">&nbsp;</span></span></a>
					<a href="javascript:void(0)" class="l-btn l-btn-large l-btn-plain" group="" id=""><span class="l-btn-left l-btn-icon-top"><span class="l-btn-text">Shapes</span><span class="l-btn-icon icon-shapes-large">&nbsp;</span></span></a>
					<div class="ribbon-group-sep"></div>
					<a href="javascript:void(0)" class="l-btn l-btn-large l-btn-plain" group="" id=""><span class="l-btn-left l-btn-icon-top"><span class="l-btn-text">SmartArt</span><span class="l-btn-icon icon-smartart-large">&nbsp;</span></span></a>
					<a href="javascript:void(0)" class="l-btn l-btn-large l-btn-plain" group="" id=""><span class="l-btn-left l-btn-icon-top"><span class="l-btn-text">Chart</span><span class="l-btn-icon icon-chart-large">&nbsp;</span></span></a>
				</div>
			</div>
			<div title="抄表管理" style="padding:10px">
				<p>Maps Content.</p>
			</div>
			<div title="报装管理" style="padding:10px">
				<p>Journal Content.</p>
			</div>
			<div title="维修情况" style="padding:10px">
				<p>History Content.</p>
			</div>
			<div title="基本设置" style="padding:10px">
				<p>References Content.</p>
			</div>
			<div title="数据统计" data-options="tabWidth:110" style="padding:10px">
				<p>Contact Content.</p>
			</div>
		</div>
	</div>
	<div data-options="region:'center'">

		<div class="easyui-layout" data-options="fit:true">
			<div data-options="region:'west',split:true,border:false" style="width:240px">
				<table class="easyui-treegrid" style="width:100%; height:100%"
						data-options=" url:'address_division.json', method:'get', idField:'id', treeField:'name', lines:true, animate:true, border:false">
					<thead>
						<tr>
							<th data-options="field:'name'" width="70%" align="left">小区</th>
							<th data-options="field:'size'" width="30%" align="right">户数</th>
						</tr>
					</thead>
				</table>
			</div>
			<div data-options="region:'center',border:false">
			</div>
		</div>

	</div>
</body>
</html>